<template>
    <a-row :gutter="8">
        <a-col :span="5" style="border-right: 1px solid var(--color-neutral-4)">
            <a-spin :loading="loading">
                <a-tree
                        :checkable="true"
                        v-model:checked-keys="checkedKeys"
                        @check="check"
                        :data="menus"
                        :default-expand-all="true"
                />
            </a-spin>
            <a-row>
                <a-col :span="12">
                    <a-button type="primary" status="warning" @click="getMenusByRoleId">重置</a-button>
                </a-col>
                <a-col :span="12">
                    <a-button type="primary" @click="saveRoleMenus">保存</a-button>
                </a-col>
            </a-row>
        </a-col>
        <a-col :span="2">
        </a-col>
    </a-row>
</template>

<script>
    export default {
        name: "",
        props: {
            record: {
                type: Object,
                required: true
            },
            menus: {
                type: Array,
                required: true
            }
        },
        data() {
            return {
                loading: false,
                checkedKeys: [],
            }
        },
        methods: {
            check(keys) {
                console.log(keys)
            },
            getMenusByRoleId() {
                this.loading = true
                this.$get(this.requestUrl.getMenusByRoleId.url + this.record.id).then(res => {
                    this.checkedKeys = res.obj
                    this.loading = false
                })
            },
            saveRoleMenus() {
                this.$put(this.requestUrl.updateRoleMenus.url + '?rId=' + this.record.id + '&menuIds=' + this.checkedKeys).then(res => {
                    if (res) {
                        //修改了权限后如果当前用户有被修改的角色,就清空当前的store里的menus,然后注销
                        //如果当前用户没有该角色,就让后端把有该角色的用户都踢下线
                        let user = JSON.parse(window.localStorage.getItem('user'))
                        for (let roles of user.roles) {
                            if (roles.id === this.record.id) {
                                //退出登录
                                this.$post(this.requestUrl.logout.url)
                                //清空用户信息
                                window.localStorage.removeItem("token")
                                window.localStorage.removeItem("user")
                                //清空菜单
                                this.$store.commit('initRoutes', [])
                                this.$router.replace('/')
                            }
                            return
                        }
                        this.$message.success(res.message)
                        this.getMenusByRoleId()
                    }
                })
            }
        },
        mounted() {
            this.getMenusByRoleId()
        }
    }
</script>

<style scoped>

</style>
